﻿<extend name="Public:office" />
<block name="title"><title>任务管理</title></block>
<block name="header_styles">
</block>
<block name="main">
    <div class="task-container">
        <ul class="task-menu">
            <li class="active"><a href="javascript:void(0);">任务管理</a></li>
            <li>  |  </li>
            <li><a href="{:U('/Html/page2')}">任务统计</a></li>
        </ul>
        <div class="task-body">
            <div class="task-left">
                <ul class="nav nav-task">
                    <li class="active"><a href="#tabMyPublish" data-toggle="tab">我的发布</a></li>
                    <li>|</li>
                    <li><a href="#tabMyTasks" data-toggle="tab">我的任务</a></li>
                    <li>|</li>
                    <li><a href="#tabFollowMe" data-toggle="tab">@我</a></li>
                </ul>
                <div class="tab-content task-list">
                    <div class="tab-pane active" id="tabMyPublish">
                        <div class="publish-container">
                            <div class="task-item active">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                            <div class="task-item">
                                <select id="select1" class="task-item-status">
                                    <option>未开始</option>
                                    <option>进行中</option>
                                    <option>已提交</option>
                                    <option>已验收</option>
                                </select>
                                <!--<span class="task-status">未开始</span>-->
                                <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" data-cancel="false" />
                                <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                                <div class="task-info">
                                    <div class="pull-left text-nowrap"><strong>执行者：</strong>小孩</div>
                                    <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                    <div class="clearfix"></div>
                                </div>
                            </div>
                        </div>
                        <div class="text-center task-buttons">
                            <a href="javascript:void(0);" class="publish-button" id="btnAddNewTask"><i class="fa fa-plus"></i> 任务发布</a>
                        </div>
                    </div>
                    <div class="tab-pane" id="tabMyTasks">
                        <div class="task-item active">

                            <select id="select1" class="task-item-status">
                                <option>未开始</option>
                                <option>进行中</option>
                                <option>已提交</option>
                                <option>已验收</option>
                            </select>
                            <img src="__PUBLIC__/themes/images/icon_topprority.png" class="img-priority" />
                            <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                            <div class="task-info">
                                <div class="pull-left text-nowrap"><strong>发布者：</strong>小孩</div>
                                <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                <div class="clearfix"></div>
                            </div>
                        </div>
                        <div class="task-item">
                            <select id="select1" class="task-item-status">
                                <option>未开始</option>
                                <option>进行中</option>
                                <option>已提交</option>
                                <option>已验收</option>
                            </select>
                            <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                            <div class="task-info">
                                <div class="pull-left text-nowrap"><strong>发布者：</strong>小孩</div>
                                <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                <div class="clearfix"></div>
                            </div>
                        </div>
                        <div class="task-item">
                            <select id="select1" class="task-item-status">
                                <option>未开始</option>
                                <option>进行中</option>
                                <option>已提交</option>
                                <option>已验收</option>
                            </select>
                            <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                            <div class="task-info">
                                <div class="pull-left text-nowrap"><strong>发布者：</strong>小孩</div>
                                <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                <div class="clearfix"></div>
                            </div>
                        </div>
                        <div class="task-item">
                            <select id="select1" class="task-item-status">
                                <option>未开始</option>
                                <option>进行中</option>
                                <option>已提交</option>
                                <option>已验收</option>
                            </select>
                            <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                            <div class="task-info">
                                <div class="pull-left text-nowrap"><strong>发布者：</strong>小孩</div>
                                <div class="pull-right text-nowrap"><strong>截止期：</strong>2015.06.01</div>
                                <div class="clearfix"></div>
                            </div>
                        </div>

                    </div>
                    <div class="tab-pane" id="tabFollowMe">
                        <div class="task-item active">
                            <select id="select1" class="task-item-status">
                                <option>未开始</option>
                                <option>进行中</option>
                                <option>已提交</option>
                                <option>已验收</option>
                            </select>
                            <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                            <div class="task-info">
                                <div class="text-nowrap">
                                    <strong>发布者：</strong><span class="limit-text" style="width:40px;" title="小孩小孩">小孩小孩</span>
                                    <strong>执行者：</strong><span class="limit-text" style="width:40px;" title="作家">作家</span>
                                    <strong>截止期：</strong>2015.06.01
                                </div>
                            </div>
                        </div>
                        <div class="task-item">
                            <select id="select1" class="task-item-status">
                                <option>未开始</option>
                                <option>进行中</option>
                                <option>已提交</option>
                                <option>已验收</option>
                            </select>
                            <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                            <div class="task-info">
                                <div class="text-nowrap">
                                    <strong>发布者：</strong><span class="limit-text" style="width:40px;" title="小孩小孩">小孩小孩</span>
                                    <strong>执行者：</strong><span class="limit-text" style="width:40px;" title="作家">作家</span>
                                    <strong>截止期：</strong>2015.06.01
                                </div>
                            </div>
                        </div>
                        <div class="task-item">
                            <select id="select1" class="task-item-status">
                                <option>未开始</option>
                                <option>进行中</option>
                                <option>已提交</option>
                                <option>已验收</option>
                            </select>
                            <h3><a href="#">首页原型设计首页原型设计首页原型设计</a></h3>
                            <div class="task-info">
                                <div class="text-nowrap">
                                    <strong>发布者：</strong><span class="limit-text" style="width:40px;" title="小孩小孩">小孩小孩</span>
                                    <strong>执行者：</strong><span class="limit-text" style="width:40px;" title="作家">作家</span>
                                    <strong>截止期：</strong>2015.06.01
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="task-main" id="taskMain">
                <div class="task-details">
                    <form method="post" onsubmit="return onAddNewTaskSubmit()" id="formAddNewTask" class=" form-horizontal">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <div class="form-group">
                                    <label class="col-xs-2 control-label">执 行 者:</label>
                                    <div class="col-xs-10">
                                        <select class="form-control" name="executor" id="executor" style="max-width:200px;"></select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-xs-2 control-label">抄&nbsp;&nbsp;&nbsp;送:</label>
                                    <div class="col-xs-10">
                                        <select id="selCC" name="cc"></select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-xs-2 control-label">截&nbsp;止&nbsp;日&nbsp;期:</label>
                                    <div class="col-xs-10">
                                        <input type="text" class="task-input required date" id="txtExpires" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="col-xs-9 col-xs-offset-2 checkbox">
                                        <label>
                                            <input type="checkbox" />&nbsp;加急
                                        </label>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-xs-2 control-label">任&nbsp;务&nbsp;标&nbsp;题:</label>
                                    <div class="col-xs-10">
                                        <input type="text" class="form-control" name="title" id="title" data-val="true" data-val-required="必填" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-xs-2 control-label">任&nbsp;务&nbsp;描&nbsp;述:</label>
                                    <div class="col-xs-10">
                                        <textarea type="text" class="form-control" id="taskcontent" name="taskcontent" data-val="true" data-val-required="必填" maxlength="2000" rows="10"></textarea>
                                    </div>
                                </div>

                                <div class="form-buttons text-center">
                                    <button type="submit" class="btn btn-green">发布</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <!--<div class="task-details" >
                    <div class="task-details-heading">
                        <img src="__PUBLIC__/themes/images/icon_toppriority2.png" />
                        发布者:<span>小孩</span>
                        &nbsp;&nbsp;&nbsp;&nbsp;
                        执行者:<span>作家</span>
                        &nbsp;&nbsp;&nbsp;&nbsp;
                        截止期:<span>2015.12.15</span>
                    </div>
                    <div class="task-details-title">
                        首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计
                    </div>
                    <div class="task-details-content">
                        首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计首页原型设计
                    </div>

                    <div class="task-comments">
                        <div class="task-comments-heading">任务交流</div>
                        <div class="task-comments-content">
                            <div class="task-comments-line">
                                <div class="line-heading">
                                    小孩（2015/12/1 14：02）：
                                </div>
                                <div class="line-content">
                                    吧啦吧啦小魔仙，要改版吧啦吧啦小魔仙，要改版吧啦吧啦小魔仙，要改版吧啦吧啦小魔仙，要改版吧啦吧啦小魔仙，要改版吧啦吧啦小魔仙，要改版吧啦吧啦小魔仙，要改版吧啦吧啦小魔仙，要改版
                                </div>
                            </div>
                            <div class="task-comments-line">
                                <div class="line-heading">
                                    作家（2015/12/1 14：05）：
                                </div>
                                <div class="line-content">
                                    好，三三加油做设计。
                                </div>
                            </div>
                            <div class="task-comments-line">
                                <div class="line-heading">
                                    作家（2015/12/1 14：05）：
                                </div>
                                <div class="line-content">
                                    好，三三加油做设计。
                                </div>
                            </div>
                            <div class="task-comments-line">
                                <div class="line-heading">
                                    作家（2015/12/1 14：05）：
                                </div>
                                <div class="line-content">
                                    好，三三加油做设计。
                                </div>
                            </div>
                        </div>
                        <div class="post-comments">
                            <textarea id="comments"></textarea>
                            <button class="comment-button" type="submit">发送</button>
                        </div>
                    </div>
                </div>-->


            </div>
        </div>
    </div>
</block>
<block name="footer_scripts">

    <script type="text/x-kendo-template" id="tplAddNewTask">
        <div class="task-details">
            <form method="post" onsubmit="return onAddNewTaskSubmit()" id="formAddNewTask">
                <div class="panel panel-default">
                    <div class="panel-heading">

                    </div>
                    <div class="panel-body">
                        <div class="form-group">
                            <label class="col-xs-4 control-label">执行者:</label>
                            <div class="col-xs-8">
                                <select class="form-control" name="executor" id="executor">
                                    <option>叉叉</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="task-details-heading">
                    执行者:
                    <select class="task-dropdown" style="width:70px;" name="executor" id="executor">
                        <option>叉叉</option>
                    </select>
                    抄送:
                    <select id="selCC" name="cc" style="width:130px;"></select>
                    截止期:
                    <input type="text" class="task-input required date" id="txtExpires" />
                    <label class="label-priority">加急 &nbsp;<input type="checkbox" /></label>

                </div>
                <div class="task-details-title">
                    <input type="text" class="form-control required" name="title" id="title" placeholder="任务标题..." />
                </div>
                <div class="task-details-content">
                    <textarea id="taskcontent" name="taskcontent" class="form-control required" rows="10" placeholder="任务描述..."></textarea>
                </div>
                <div class="task-buttons text-center">
                    <button type="submit">发布</button>
                </div>
            </form>
        </div>
    </script>
    <script type="text/javascript">
        require(["jquery",
                "kendoui/kendo.web.min",
                "kendoui/kendo.multiselect.min",
                "kendoui/kendo.datepicker.min",
                "culture"], function () {
            kendo.culture("zh-CN");

            $(function () {
                $("#btnAddNewTask").click(function () {
                    var html = $("#tplAddNewTask").html();
                    var tpl = kendo.template(html);
                    var renderHtml = kendo.render(tpl, [{ Id: 0 }]);
                    $("#taskMain").html(renderHtml);
                    initKendoControls();
                });

                $(".img-priority").click(function () {
                    if ($(this).data("cancel")) {
                        alert("取消");
                        $(this).remove();
                    }
                });

                $(".img-priority").hover(function () {
                    var button = $(this);
                    if (button.data("cancel")) {
                        button.data("cancel", false);
                        $(this).attr("src", "__PUBLIC__/themes/images/icon_topprority.png");
                    } else {
                        button.data("cancel", true);
                        $(this).attr("src", "__PUBLIC__/themes/images/icon_cancelprority.png");
                    }
                });

                $("#formAddNewTask").on("submit", function () {

            $(".img-priority").click(function () {
                if ($(this).data("cancel")) {
                    $.ajax({
                        url: "/toggleLevel"
                    })
                    $(this).remove();
                }
            });
                    if (!$("#formAddNewTask").valid()) {
                        return;
                    }

                    //ajax post
                    return false;


                });

                initKendoControls();
            });

            function initKendoControls() {
                $("#txtExpires").kendoDatePicker({});
                $("#selCC").kendoMultiSelect({
                    dataTextField: "text",
                    dataValueField: "value",
                    dataSource: [
                        { text: "测试用户1", value: "测试用户1" },
                        { text: "测试用户2", value: "测试用户2" },
                        { text: "测试用户3", value: "测试用户3" }],
                    //dataSource: {
                    //    type: "odata",
                    //    transport: {
                    //        read: {
                    //            url: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Products",
                    //        }
                    //    }
                    //}
                });
                //$("#formAddNewTask").removeData("validator");
                $.validator.unobtrusive.parse("#formAddNewTask");
            }

        });

        function initKendoControls() {
            $("#txtExpires").kendoDatePicker({});
            $("#selCC").kendoMultiSelect({
                dataTextField: "text",
                dataValueField: "value",
                dataSource: [
                    { text: "测试用户1", value: "测试用户1" },
                    { text: "测试用户2", value: "测试用户2" },
                    { text: "测试用户3", value: "测试用户3" }],
                //dataSource: {
                //    type: "odata",
                //    transport: {
                //        read: {
                //            url: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Products",
                //        }
                //    }
                //}
            });
            //$("#formAddNewTask").removeData("validator");
            $.validator.unobtrusive.parse("#formAddNewTask");
        }

    </script>
</block>
